<blockquote class="layui-elem-quote">
  <div class="layui-inline">
    <i class="layui-icon layui-icon-list layui-head-icon"></i>
    <span class="layui-font-16 layui-font-green">订单管理</span>
  </div>
</blockquote>
<div class="layui-card">
  <div class="layui-card-body">
    <fieldset class="layui-elem-field">
      <legend>条件搜索</legend>
      <div class="layui-field-box">
        <form class="layui-form layui-form-pane" action="{:url('/store/order/delivery')}" method="GET">
          <div class="layui-form-item">
            <div class="layui-inline">
              <label class="layui-form-label">时间</label>
              <div class="layui-inline" id="time">
                <div class="layui-input-inline">
                  <input type="text" autocomplete="off" name="start_time" id="strat-time" class="layui-input"
                    placeholder="开始日期">
                </div>
                <div class="layui-form-mid">-</div>
                <div class="layui-input-inline">
                  <input type="text" autocomplete="off" name="end_time" id="end-time" class="layui-input"
                    placeholder="结束日期">
                </div>
              </div>
            </div>
            <div class="layui-inline">
              <label class="layui-form-label">订单号</label>
              <div class="layui-input-inline">
                <input type="text" name="keyword" placeholder="请输入订单号或用户昵称" autocomplete="off" class="layui-input">
              </div>
            </div>
            <div class="layui-inline">
              <div class="layui-input-inline">
                <button class="layui-btn" lay-submit lay-filter="search">搜索</button>
              </div>
            </div>
          </div>
        </form>
      </div>
    </fieldset>
    <form class="layui-form">
      <table class="layui-table">
        <thead>
          <tr>
            <th>订单编号</th>
            <th>商品信息</th>
            <th>实付款</th>
            <th>支付方式</th>
            <th>订单状态</th>
            <th>下单时间</th>
            <th>操作</th>
          </tr>
        </thead>
        <tbody>

          {foreach $list as $vo}
          <tr>
            <td>{$vo.order_no}</td>
            <td>
              {foreach $vo.items as $v}
              <div class="layui-inline">
                <div class="layui-inline" style="margin-right: 10px">
                  <img src="{$v.image}" class="layui-view-img">
                </div>
                <div class="layui-inline">
                  <p class="layui-font-black">{$v.goods_name}</p>
                  <p class="layui-font-black">{$v.attr}</p>
                  <p>${$v.sell_price}</p>
                  <p>x{$v.buy_num}</p>
                </div>
              </div>
              {/foreach}
            </td>
            <td>{$vo.real_amount}</td>
            <td>{$vo.payment_type}</td>
            <td>{$vo.status}</td>
            <td>{$vo.create_time|date='Y-m-d H:i:s'}</td>
            <td>
              <a class="layui-btn layui-btn layui-btn-sm send_delivery" data-id="{$vo.id}">发货</a>
              <a class="layui-btn layui-btn-sm" href="{:url('/store/order/read',['order_id' => $vo.id])}">订单详情</a>
              <a class="layui-btn layui-btn-danger layui-btn-sm refund" data-id="{$vo.id}">退款</a>
            </td>
          </tr>
          {/foreach}
        </tbody>
      </table>
    </form>
    {$list|raw}


  </div>
</div>

<!-- <script>
layui.use('layer', function(){ //独立版的layer无需执行这一句
  var $ = layui.jquery, layer = layui.layer; //独立版的layer无需执行这一句

  
 
});
</script> -->

<script>
  layui.use('laydate', function () {
    var laydate = layui.laydate;
    laydate.render({
      elem: '#time',
      type: 'datetime',
      range: ['#strat-time', '#end-time'],
    });




  })

  $(document).on('click', '.send_delivery', function () {
    let id = $(this).attr('data-id');
    layer.prompt({
      formType: 0,
      value: '',
      title: '请输入快递单号',
      area: ['300px', '200px'] //自定义文本域宽高
    }, function (value, index, elem) {
      $.get('/store/order.order/sendDelivery?order_id=' + id + '&courier_number=' + value, function (res) {
        if (res.code == 1) {
          layer.msg(res.msg, { icon: 1 });
          return false;
        }
        layer.msg(res.msg, { icon: 2 });
      });
      layer.close(index);
      window.location.reload();
    });
    //   layer.open({
    //   id:1,
    //   type: 1,
    //   title:'请输入问题',
    //   style: 'width:500px;height:100px;',
    //   content: "<div style='display:flex;justify-content:center;'><textarea id='area' style='width:100%;height:135px;'></textarea></div>",
    //   btn:['保存','取消'],
    //   yes:function (index,layero) {
    //       //获取输入框里面的值
    //       var closeContent = top.$("#area").val() || $("#area").val();
    //       if(closeContent){
    //           console.log(closeContent);
    //       }
    //       layer.close(index);
    //       // 在这里提交数据
    //   },
    //   no:function (index,layero) {
    //       layer.close(index);
    //     }
    // });
  });

  $(document).on('click', '.refund', function () {
    let id = $(this).attr('data-id');
    layer.confirm('您确定要退款吗？', {
      title: ['温馨提示'],
      btn: ['确定', '取消']
    }, function () {
      $.get('/store/order/refund?order_id=' + id, function (res) {
        if (res.code == 1) {
          layer.msg(res.msg, { icon: 1 });
          return false;
        }
        layer.msg(res.msg, { icon: 2 });
      });
    });
  });
</script>